<template>
  <div id="FaultDispatch">
    <!--查询表单-->
    <el-form label-position="left" size="mini" :inline="true" :model="queryForm" label-width='90px' class="query-form">
        <el-form-item label="装维员姓名">
            <el-input v-model="queryForm.xm" clearable placeholder="请输入装维员姓名"></el-input>
        </el-form-item>
        <el-form-item>
            <el-button type="primary" size="mini" icon="el-icon-search" @click="getData(1)">查询</el-button>
            <el-button type="primary"     size="mini" @click="clearQuery">清空</el-button> 
            <!-- <el-button type="primary" size="mini" @click="dialogAddVisible = true">新增</el-button>-->
            <el-button type="primary" icon="iconfont icon--daochu" size="mini" @click="export2Excel">导出</el-button> 
        </el-form-item>
         <!-- <el-form-item>
            &nbsp;&nbsp;&nbsp;&nbsp;<a class="text-base" @click='query_show = !query_show; '>更多查询条件<i :class="'iconfont icon-'+query_show"></i></a>
        </el-form-item> 
        <div v-show="query_show">
            <div class="input-box">
                <el-form-item label="故障类型">
                    <el-select v-model="queryForm.gzlx" clearable placeholder="请选择">
                      <el-option v-for="item in config.gzlxList" :key="item" :value="item" :label="item"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="工单状态">
                    <el-select v-model="queryForm.state" clearable placeholder="请选择">
                      <el-option v-for="item in config.gzdStateList" :key="item" :value="item" :label="item"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="区域">
                    <el-select v-model="queryForm.qy" clearable placeholder="请选择">
                      <el-option v-for="item in config.qyList" :key="item" :value="item" :label="item"></el-option>
                    </el-select>
                </el-form-item>
            </div>
            <div class="input-box">
                <el-form-item label="派单时间">
                    <el-date-picker
                        v-model="queryForm.createTime"
                        type="daterange"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        value-format="yyyy-MM-dd"
                        :default-time="['00:00:00', '23:59:59']">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="归档时间">
                    <el-date-picker
                        v-model="queryForm.doneTime"
                        type="daterange"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        value-format="yyyy-MM-dd"
                        :default-time="['00:00:00', '23:59:59']">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="撤单时间">
                    <el-date-picker
                        v-model="queryForm.createTime"
                        type="daterange"
                        start-placeholder="开始日期"
                        end-placeholder="结束日期"
                        value-format="yyyy-MM-dd"
                        :default-time="['00:00:00', '23:59:59']">
                    </el-date-picker>
                </el-form-item>
            </div>
        </div> -->
    </el-form>

    <!--客户表格数据展示-->
    <el-table class="table" ref="table" :data="tableData" border style="width: 100%;"
        @sort-change="sortChange" v-loading="loading" :header-cell-style="{padding: 0,height: '34px'}"
      >
      <el-table-column prop="xm" label="姓名" sortable="custom" :show-overflow-tooltip="true" ></el-table-column>
      <el-table-column prop="gm"  sortable="custom" label="光猫" ></el-table-column>
      <el-table-column prop="jdh" sortable label="机顶盒" ></el-table-column>
      <!-- <el-table-column prop="qy" sortable="custom" label="区域"></el-table-column> -->
      <!-- <el-table-column prop="gswg" sortable="custom" label="区域/装维">
        <template slot-scope="scope">
          <p><span>{{scope.row.qy}}</span><span v-if="scope.row.zwsfCname">({{scope.row.zwsfCname}})</span></p>
        </template>
      </el-table-column> -->
      <el-table-column prop="fgq" sortable="custom" label="分光器" :show-overflow-tooltip="true" ></el-table-column>
      <el-table-column prop="px" sortable="custom" label="皮线" :show-overflow-tooltip="true"></el-table-column>
      <el-table-column prop="wq" sortable="custom" label="尾纤" :show-overflow-tooltip="true" ></el-table-column>
      <!-- <el-table-column prop="fromWhere" sortable="custom" label="来源" width="90">
        <template slot-scope="scope">
          <p v-if="scope.row.fromWhere == '微信'"><i style="font-size: 20px;color: #69db5b;" class="iconfont icon-weixin"></i></p>
        </template>
      </el-table-column> -->
      <!-- <el-table-column prop="wthf" sortable="custom" label="操作" width="160px" :show-overflow-tooltip="true">
        <template slot-scope="scope">
          <el-tooltip class="item" effect="dark" content="查看" placement="bottom">
            <span class="iconfont icon-chakan cursor text-base" style="padding: 0 6px;" @click="getCbList(scope.row)"></span>
          </el-tooltip>
          <el-tooltip class="item" effect="dark" content="撤单" placement="bottom">
            <span class="iconfont icon-chexiao cursor text-base" style="padding: 0 6px;" @click="cancelClick(scope.row)"></span>
          </el-tooltip>
          <el-tooltip class="item" effect="dark" content="催办" placement="bottom">
            <span class="iconfont icon-cuiban cursor text-base" style="padding: 0 6px;" @click="urgent(scope.row)"></span>
          </el-tooltip>
          <el-tooltip class="item" effect="dark" content="转派" placement="bottom">
            <span class="iconfont icon-zhuanpai cursor text-base" style="padding: 0 6px;" @click="transferClick(scope.row)"></span>
          </el-tooltip>
        </template>
      </el-table-column> -->
    </el-table>

    <!--客户表格数据分页-->
    <el-pagination v-if="count" background layout="total,prev, pager, next"
        :page-size="pageSize"
        @current-change="getData"
        :current-page="currentPage"
        :total="count" style="float: right;">
    </el-pagination>

    <!--新增故障单-->
    <!-- <el-dialog title="采购信息录入" width="900px" @close="closeAdd" class="dialog dialogAdd" custom-class="custom-dialog"
               :visible.sync="dialogAddVisible" :close-on-click-modal='false'>
      <el-form ref="addForm" style="margin-right: 20px;" :model="addForm" :inline="true" :rules="addFormRules" label-position="right" label-width="100px" size="mini"> -->
        <!-- <el-form-item label="宽带捆绑号码">
          <el-input v-model="khzh" clearable placeholder="" style="margin-right: 7px;">
          </el-input><el-button type="primary" size="mini" @click="getKhzl">查询</el-button>
        </el-form-item> -->
        <!-- <el-form-item label="姓名" prop="khzh">
          <el-input v-model="addForm.khzh"></el-input>
        </el-form-item>
        <el-form-item label="手机号码" prop="khxm">
          <el-input v-model="addForm.khxm"></el-input>
        </el-form-item>
          <el-form-item label="采购时间" prop="zxsk">
          <el-date-picker v-model="addForm.pdsj" 
            type="date" placeholder="选择采购时间">
          </el-date-picker>
        </el-form-item> -->
         <!-- <el-form-item label="设备名称" prop="khhm">
          <el-input v-model="addForm.khhm"></el-input>
        </el-form-item>  -->
          <!-- <el-form-item label="设备名称" prop="gzlx">
          <el-select v-model="sbmcList" clearable>
            <el-option
              v-for="value in gzlxList"
              :key="value"
              :label="value"
              :value="value">
            </el-option>
          </el-select>
        </el-form-item> 
        <el-form-item label="采购数量" prop="lxrxm">
          <el-input v-model="addForm.lxrxm"></el-input>
        </el-form-item>
        <el-form-item label="采购单价" prop="lxrdh">
          <el-input v-model="addForm.lxrdh"></el-input>
        </el-form-item>
        <el-form-item label="备注" prop="khdz">
          <el-input v-model="addForm.khdz"></el-input>
        </el-form-item>
         <el-form-item label="" prop="khdz">
      
        <el-button type="primary" size="mini" @click="import2Excel" id="aa">导入</el-button>
        </el-form-item> -->
        <!-- <el-form-item label="归属网格" prop="gswg" >
          <el-cascader :options="options" v-model="addForm.gswg"></el-cascader>
        </el-form-item>
        <el-form-item label="报障方式" prop="bzfs">
          <el-select v-model="addForm.bzfs" clearable>
            <el-option v-for="value in config.bzfsList" :key="value" :label="value" :value="value"></el-option>
          </el-select>
        </el-form-item> -->
    
        <!-- <el-form-item label="故障描述" prop="gzms">
          <el-input
            type="textarea"
            resize="none"
            :autosize="{ minRows: 3, maxRows: 10}"
            placeholder="请输入故障描述"
            v-model="addForm.gzms">
          </el-input>
        </el-form-item> -->
      <!-- </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogAddVisible = false" size="mini">取 消</el-button>
        <el-button type="primary" @click="add" size="mini">确 定</el-button>
      </div>
    </el-dialog> -->
    <!--撤单-->
    <!-- <el-dialog title="撤单" width="600px" @close="cancelForm = {}" class="dialog dialogAdd" custom-class="custom-dialog"
               :visible.sync="dialogCancelVisible" :close-on-click-modal='false'>
      <el-form ref="cancelForm" style="margin-right: 20px;" :model="cancelForm" :inline="true" label-position="right" label-width="80px" size="mini">
        <el-form-item label="备注" prop="remark">
          <el-input type="textarea" resize="none" :autosize="{ minRows: 3, maxRows: 10}" v-model="cancelForm.remark"></el-input>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogCancelVisible = false" size="mini">取 消</el-button>
        <el-button type="primary" @click="cancel" size="mini">确 定</el-button>
      </div>
    </el-dialog> -->

    <!--转派-->
    <!-- <el-dialog title="转派" width="600px" @close="closeTransfer" class="dialog dialogAdd" custom-class="custom-dialog"
               :visible.sync="dialogTransferVisible" :close-on-click-modal='false'>
      <el-form ref="transferForm" style="margin-right: 20px;" :model="transferForm" :rules="transferFormRules" :inline="true" label-position="right" label-width="100px" size="mini">
        <el-form-item label="归属网格" prop="gswg">
          <el-cascader :options="options" v-model="transferForm.gswg" @change="changeWg"></el-cascader>
        </el-form-item>
        <el-form-item label="装维师傅" prop="zwsfId">
          <el-select v-model="transferForm.zwsfId" clearable>
            <el-option
              v-for="item in zwsfList"
              :key="item.id"
              :label="item.userCname"
              :value="item.userId + '/' + item.userCname">
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="备注" prop="remark">
          <el-input type="textarea" resize="none" :autosize="{ minRows: 3, maxRows: 10}" v-model="transferForm.remark"></el-input>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogTransferVisible = false" size="mini">取 消</el-button>
        <el-button type="primary" @click="transfer" size="mini">确 定</el-button>
      </div>
    </el-dialog> -->
    <!--故障工单催办-->
    <!-- <el-dialog title="故障工单催办" width="600px" class="dialog dialogUrgent"
               :visible.sync="dialogUrgentVisible" :close-on-click-modal='false'>
      <el-form style="margin-right: 20px;" label-position="right" label-width="112px" size="small">
        <p class="label-box">
          <span class="label-text">派单人：</span>
          <span class="label-value">{{urgentData.createUserCname}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">报障方式：</span>
          <span class="label-value">{{urgentData.bzfs}}</span>
        </p> -->
        <!-- <p class="label-box">
          <span class="label-text">EOMS/V600工单号：</span>
          <span class="label-value">{{urgentData.gswg}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">EOMS/V600下单时间：</span>
          <span class="label-value">{{urgentData.pdsj}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">是否批量故障：</span>
          <span class="label-value">{{urgentData.gswg}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">预处理是否解决故障：</span>
          <span class="label-value">{{urgentData.gswg}}</span>
        </p> -->
        <!-- <p class="label-box">
          <span class="label-text">故障类型：</span>
          <span class="label-value">{{urgentData.gzlx}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">故障说明：</span>
          <span class="label-value">{{urgentData.gzms}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">报障地址：</span>
          <span class="label-value">{{urgentData.khdz}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">归属网格：</span>
          <span class="label-value">{{urgentData.gswg}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">客户名称：</span>
          <span class="label-value">{{urgentData.khxm}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">客户电话：</span>
          <span class="label-value">{{urgentData.khhm}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">联系人：</span>
          <span class="label-value">{{urgentData.lxrxm}}</span>
        </p>
        <p class="label-box">
          <span class="label-text">联系电话：</span>
          <span class="label-value">{{urgentData.lxrdh}}</span>
        </p>
        <el-form-item label="催办备注：" prop="remark">
          <el-input
            type="textarea"
            :autosize="{ minRows: 3, maxRows: 10}"
            placeholder="请输入催办原因"
            v-model="remark">
          </el-input>
        </el-form-item>
      </el-form>

      <div slot="footer" class="dialog-footer">
        <el-button @click="dialogUrgentVisible = false">取 消</el-button>
        <el-button type="primary" @click="addCd">确 定</el-button>
      </div>
    </el-dialog> -->
    <!--故障工单催办-->
    <!-- <el-dialog title="故障详情" width="800px" class="dialog" @close="gzxqTab='first'" custom-class="gzdxq-dialog"
               :visible.sync="dialogUrgentHistoryVisible" :close-on-click-modal='false'>
      <el-tabs v-model="gzxqTab">
        <el-tab-pane label="工单信息" name="first">
          <table class="gzd-detail">
            <tr>
              <td width="110">工单号：</td>
              <td>{{currentItem.no}}</td>
            </tr>
            <tr>
              <td>当前状态：</td>
              <td>{{currentItem.state}}</td>
            </tr>
            <tr>
              <td>派单时间：</td>
              <td>{{currentItem.createTime}}</td>
            </tr>
            <tr>
              <td>派单人：</td>
              <td>{{currentItem.createUserCname}}</td>
            </tr>
            <tr>
              <td>派单人电话：</td>
              <td>{{currentItem.createUserPhone}}</td>
            </tr>
            <tr>
              <td>报障方式：</td>
              <td>{{currentItem.bzfs}}</td>
            </tr>
            <tr>
              <td>故障类型：</td>
              <td>{{currentItem.gzlx}}</td>
            </tr>
            <tr>
              <td>故障说明：</td>
              <td>{{currentItem.gzms}}</td>
            </tr>
            <tr>
              <td>一级故障原因：</td>
              <td>{{currentItem.gz1}}</td>
            </tr>
            <tr>
              <td>二级故障原因：</td>
              <td>{{currentItem.gz2}}</td>
            </tr>
            <tr>
              <td>三级故障原因：</td>
              <td>{{currentItem.gz3}}</td>
            </tr>
            <tr>
              <td>报障地址：</td>
              <td>{{currentItem.khdz}}</td>
            </tr>
            <tr>
              <td>归属网格：</td>
              <td>{{currentItem.gswg}}</td>
            </tr>
            <tr>
              <td>客户名称：</td>
              <td>{{currentItem.khxm}}</td>
            </tr>
            <tr>
              <td>联系电话：</td>
              <td>{{currentItem.khhm}}</td>
            </tr>
            <tr>
              <td>施工装维：</td>
              <td>{{currentItem.zwsfCname}}</td>
            </tr>
            <tr>
              <td>施工装维电话：</td>
              <td>{{currentItem.zwsfPhone}}</td>
            </tr>
            <tr>
              <td>预约上门时间：</td>
              <td>{{currentItem.yysj}}</td>
            </tr>
          </table>
        </el-tab-pane>
        <el-tab-pane label="流程轨迹" name="second">
          <!--表格数据展示-->
          <!-- <el-table class="table" :data="cbList" v-loading="cbLoading" :header-cell-style="{padding: 0,height: '34px'}"
              max-height="500" border style="width: 100%;"
            >
            <el-table-column prop="createUserCname" sortable="custom" label="处理人" width="80"></el-table-column>
            <el-table-column prop="createTime" sortable label="处理时间"></el-table-column>
            <el-table-column prop="gdState" sortable label="工单状态"></el-table-column>
            <el-table-column prop="operateType" sortable="custom" label="处理结果"></el-table-column>
            <el-table-column prop="reason" sortable="custom" label="原因" :show-overflow-tooltip="true"></el-table-column> -->
            <!-- <el-table-column sortable="custom" label="图片">
              <template slot-scope="scope">
                <p v-if="scope.row.imgs" @click="show(scope.row.imgs)" style="cursor: pointer; color: #409EFF;">查看图片</p>
              </template>
            </el-table-column> -->
            <!-- <el-table-column prop="remark" sortable="custom" label="备注" :show-overflow-tooltip="true"></el-table-column>
          </el-table>
        </el-tab-pane>
      </el-tabs>
    </el-dialog>  -->
    <!-- <viewer :images="images" @inited="inited" class="viewer" ref="viewer">
      <template slot-scope="scope">
        <img v-show="false" v-for="src in scope.images" :src="src" :key="src">
      </template>
    </viewer> -->
  </div>
</template>

<script>
import 'viewerjs/dist/viewer.css'
import Viewer from "v-viewer/src/component.vue"
export default {
  name: 'FaultDispatch',
  components: {
    Viewer
  },
  data () {
    return {
      gzlxList:["光猫","分光器","机顶盒","光纤","尾纤",'工衣','电脑','熔纤机', '切割机', '米勒钳','光功率','红光笔','伸缩梯','小电视','安全用品','高清电视','皮线开剥器','蓝牙标签机'],//材料设备,
      queryForm: {},    //  查询条件
      prop: 'createTime', //  排序属性
      order: -1,    //  排序 升序、降序
      tableData: [],    //  当前页数据
      loading: false,
      query_show: false,          //  是否显示更多查询
      count: '',      //  总数据条数
      currentPage: 1,//默认开始页面
      pageSize: 20,//每页的数据条数
    /************************新增故障单********************* */
      addForm: {
        khzh: '',
        khxm: '',
        khhm: '',
        khdz: '',
        lxrxm: '',
        lxrdh: '',
        gswg: [],
        zwsfId: '',
        bzfs: '',
        pdsj: '',
        gzlx: '',
        sex: '',
      },                //  新增表单
      addFormRules:{
          khzh: [{ required: true, validator: this.isNull, trigger: 'blur' }],
          khxm: [{ required: true, validator: this.isNull, trigger: 'blur' }],
          khhm: [{ required: true, validator: this.isNull, trigger: 'blur' }],
          khdz: [{ required: true, validator: this.isNull, trigger: 'blur' }],
          lxrxm: [{ required: true, validator: this.isNull, trigger: 'blur' }],
          lxrdh: [{ required: true, validator: this.isNull, trigger: 'blur' }],
          bzfs: [{ required: true, validator: this.isNull, trigger: 'change' }],
          gswg: [{ required: true, validator: this.isArrayNull, trigger: 'change' }],
          sex: [{ required: true, validator: this.isNull, trigger: 'change' }]
      },//新增校验规则
      khzh: '',         //  新增时搜索
      dialogAddVisible: false,    //  新增模态框
      options: [],
    /************************故障工单催办********************* */
     // urgentData: {},     //  当前催办单
    //  remark: '',           //  催办备注
    //  dialogUrgentVisible: false,    //  模态框
    /************************故障详情********************* */
    //  currentItem: {},
    //  gzxqTab: 'first',
    //  cbList: {},     //  催办历史
    //  cbListShow: false,  //  获取催办历史后显示
    //  dialogUrgentHistoryVisible: false,    //  催办历史模态框
    //  cbLoading: true,
    //  images: [], //  图片信息
    /************************撤单********************* */
     // dialogCancelVisible: false,    //  撤单模态框
     // cancelForm: {},     //  撤单表单
    /************************转派********************* */
    //  dialogTransferVisible: false,    //  转派模态框
    //  transferForm: {gswg: [], zwsfId: ''},     //  转派表单
    //  zwsfList: [],               //  装维师傅列表
   //   transferFormRules:{
    //      gswg: [{ required: true, validator: this.isArrayNull, trigger: 'change' }],
    //  },//新增校验规则
    }
  },
  mounted(){
    this.getData(1)
    this.getWg()
  },

  methods: {
    getData(val){
      let params = {}
      let queryForm = this.deepClone(this.queryForm)
      params.currentPage = val
      params.pageSize = this.pageSize
      params.queryForm = queryForm
      params.prop = this.prop
      params.order = this.order
       this.startLoading()
      this.$post("/api/ClCkController/getClckList",params, (data) => {
        this.tableData = data.list;
        this.count = data.count;
        this.loading = false
      })
    },
    //  清空查询
    clearQuery(){
        this.queryForm = {}
        this.getData(1)
    },
    // 排序
    sortChange(obj){
      this.prop = obj.prop || "createTime"
      this.order = obj.order == 'ascending' ? 1 : -1
      this.getData(1)
    },
  /***********************导出******************* */
    formatJson(filterVal, jsonData) {
　　　return jsonData.map(v => filterVal.map(j => v[j]))
　　},
    export2Excel() {
      let params = {}
      let queryForm = this.deepClone(this.queryForm)
      params.currentPage = 1
      params.queryForm = queryForm
      params.prop = this.prop
      params.order = this.order
      this.$post("/api/ClCkController/getClckList",params, (data) => {
        let tableData = data.list;
        require.ensure([], () => {
  　　　　const { export_json_to_excel } = require('../vendor/Export2Excel');
  　　　　const tHeader =['姓名','光猫','机顶盒','分光器','皮线','尾纤'];
  　　　　const filterVal =['xm','gm','jdh','fgq','px','wq'];
  　　　　const data = this.formatJson(filterVal, tableData);
  　　　　export_json_to_excel(tHeader, data, '材料查看');
  　　　})
      })
　  },
  /******************新增***************** */
    //  获取网格
    getWg(){
      let params = {}
      params.currentPage = 1
      params.queryForm = {}
      params.prop = 'name'
      params.order = 1
      this.$post("/api/WgController/getList",params, (data) => {
        let options = []
        let qyList = this.config.qyList
        qyList.map(item => {
          options.push({
            value: item,
            label: item,
            children: []
          })
        })
        data.list.map(item => {
          let index = qyList.indexOf(item.qy)
          if(index != -1){
            options[index].children.push({
              value: item.name + '/' + item.id,
              label: item.name,
            })
          }
        })
        this.options = options
      })
    },
    //  获取客户资料
    getKhzl(){
      this.$post("/api/KhzlController/getKhzl", {id: this.khzh}, (data) => {
        if(data.khzl){
          this.addForm.khzh = data.khzl.khzh
          this.addForm.khxm = data.khzl.khxm
          this.addForm.khhm = data.khzl.khhm
          this.addForm.khdz = data.khzl.khdz
        }else{
          this.$message.error("当前客户不存在")
        }
      })
    },
    // 打开新增模态框
    openAdd(){
      
    },
    // 关闭新增模态框
    closeAdd(){
      this.$refs.addForm.resetFields()
      this.khzh = ''
    },
    // 确定新增
    add(){
      this.$refs.addForm.validate((valid) => {
        if (valid) {
          let addForm = this.deepClone(this.addForm)
          if(addForm.gswg && addForm.gswg.length){
            addForm.qy = addForm.gswg[0]
            addForm.gswgId = addForm.gswg[1].split("/")[1]
            addForm.gswg = addForm.gswg[1].split("/")[0]
          }
          if(addForm.zwsfId){
            addForm.zwsfCname = addForm.zwsfId.split('/')[1]
            addForm.zwsfId = addForm.zwsfId.split('/')[0]
          }
          this.$post("/api/GzdController/addOne", addForm, (data) => {
            this.$message.success("添加成功！")
            this.dialogAddVisible = false
            this.getData(1)
          })
        }
      })
    },

  /******************催办***************** */
    //  点击催办按钮
    // urgent(item){
    //   console.log(item)
    //   this.urgentData = item
    //   this.dialogUrgentVisible = true
    //   this.remark=''
    // },
    // 确定新增催办
    // addCd(){
    //   this.$post("/api/GzdOperateLogController/addOne", {parentId: this.urgentData.id,operateType: '催办', remark: this.remark}, (data) => {
    //     this.$message.success("催办成功！")
    //     this.dialogUrgentVisible = false
    //     this.urgentData.cbcs = this.urgentData.cbcs ? this.urgentData.cbcs + 1 : 1
    //   })
    // },
    
  /******************催办历史***************** */
    //  获取催办历史
    // getCbList(row){
    //   this.currentItem = row
    //   this.cbList = []
    //   this.dialogUrgentHistoryVisible = true
    //   this.cbLoading = true
    //   this.$post("/api/GzdOperateLogController/getList", {id: row.id}, (data) => {
    //     this.cbList = data.list
    //     this.cbLoading = false
    //   })
    // },
    //  查看图片
    // inited (viewer) {
    //   this.$viewer = viewer
    // },
    // show (list) {
    //   let images = []
    //   list.map(item => {
    //     images.push(this.config.httpHeadUrl + item)
    //   })
    //   this.images = images
    //   setTimeout(() => {
    //       this.$viewer.show()
    //   }, 0)
    // },
  /******************撤单***************** */
    //  点击撤单按钮
    // cancelClick(row){
    //   this.dialogCancelVisible = true
    //   this.currentItem = row
    // },
    //  撤单
    // cancel(){
    //   let param = {
    //     parentId: this.currentItem.id, 
    //     reason: this.cancelForm.reason, 
    //     remark: this.cancelForm.remark, 
    //     operateType: '已撤单',
    //     gdState: '已撤单',
    //   }
    //   this.startLoading()
    //   this.$post("/api/GzdOperateLogController/addOne", param, (data) => {
    //     this.dialogCancelVisible = false
    //   })
    // },
  /******************转派***************** */
    //  点击撤单按钮
    // transferClick(row){
    //   this.dialogTransferVisible = true
    //   this.currentItem = row
    // },
    // 关闭新增模态框
    // closeTransfer(){
    //   this.$refs.transferForm.resetFields()
    //   this.zwsfList = []
    // },
    //  选择归属网格
    // changeWg(){
    //   this.transferForm.zwsfId = ''
    //   if(this.transferForm.gswg && this.transferForm.gswg.length){
    //     this.$post('/api/WgController/getMembers', {name: this.transferForm.gswg[1].split('/')[0]}, (data) => {
    //       this.zwsfList = data.list
    //     })
    //   }
    // },
    //  转派
    // transfer(){
    //   this.$refs.transferForm.validate((valid) => {
    //     if (valid) {
    //       let param = {
    //         parentId: this.currentItem.id, 
    //         reason: this.cancelForm.reason, 
    //         remark: this.transferForm.remark, 
    //         operateType: '转派',
    //       }
    //       let transferForm = this.deepClone(this.transferForm)
    //       if(transferForm.gswg && transferForm.gswg.length){
    //         param.qy = transferForm.gswg[0]
    //         param.gswgId = transferForm.gswg[1].split('/')[1]
    //         param.gswg = transferForm.gswg[1].split('/')[0]
    //       }
    //       if(transferForm.zwsfId){
    //         param.zwsfCname = transferForm.zwsfId.split('/')[1]
    //         param.zwsfId = transferForm.zwsfId.split('/')[0]
    //       }
    //       console.log(param)
    //       this.startLoading()
    //       this.$post("/api/GzdOperateLogController/addOne", param, (data) => {
    //         this.dialogTransferVisible = false
    //         Object.keys(data.gzd).forEach(key => {
    //           this.currentItem[key] = data.gzd[key]
    //         })
    //       })
    //     }
    //   })
    // },
    
  
  }
}
</script>

<style lang="less" scoped>
  .custom-dialog{
    margin-top: 0 !important;
  }
  .dialogAdd {
    .el-input, .el-cascader, .el-select, .el-textarea {
      width: 300px;
    }
  }

  .label-box{
    display: flex;
    margin-bottom: 5px;
    .label-text{
      width: 100px;
      text-align: right;
      padding-right: 10px;
    }
    .label-value{
      flex: 1;
    }

  }
  .gzd-detail{
    td{
      vertical-align: top;
    }
  }
</style>
<style lang="less">
    .long-form .el-form-item__label{
      line-height: 16px;
    }
    #FaultDispatch .custom-dialog{
      margin-top: 10vh !important;
    }
    #aa{

      float: right;
    }
    #FaultDispatch .gzdxq-dialog{
      margin-top: 5vh !important;
      height: 85vh;
      .el-dialog__body{
        padding-top: 0;
        height: calc(100% - 44px);
        .el-tabs{
          height: 100%;
          .el-tabs__content{
            height: calc(100% - 60px);
            overflow: auto;
          }
        }
      }
    }
</style>

